// 全局自定义样式

html,
body {
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 14px;
  background-color: #f4f5f5;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  width: 100vw;
}

* {
  border-collapse: collapse;
  box-sizing: border-box;
}

// 浮动
.clearfix {
  &:before,
  &:after {
    display: table;
    content: "";
  }

  &:after {
    clear: both;
  }
}
.fl {
  float: left;
}
.fr {
  float: right;
}

// 定位
.position() {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
}
.full-fixed {
  position: fixed;
  .position();
}
.full-absolute {
  position: absolute;
  .position();
}

// flex
.flex() {
  display: flex;
  align-items: center;
}
.flex-row {
  .flex();
  flex-direction: row;
}
.flex-column {
  .flex();
  flex-direction: column;
}

// 字体
.ellipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.nowrap {
  white-space: nowrap;
}

a {
  text-decoration: none;
  color: #2c3e50;

  &:hover {
    text-decoration: none;
    color: #ff4d51;
  }
}

#app {
  min-height: 100vh;
}
